<template>
  <el-table
    :data="tableData"
    v-loading="laoding"
    element-loading-text="玩命加载中..."
    border
    style="width: 100%">
    <el-table-column
      fixed
      prop="id"
      label="ID"
      sortable
      width="80">
    </el-table-column>
    <el-table-column
      prop="name"
      label="用户名"
      width="300">
    </el-table-column>
    <el-table-column
      prop="created_at"
      label="创建时间"
      width="300">
    </el-table-column>
    <el-table-column
      prop="updated_at"
      label="修改时间"
      sortable
      width="120">
    </el-table-column>
    <el-table-column
      fixed="right"
      label="操作"
      sortable
      width="100">
      <template scope="scope">
        <el-button @click="handleClick" type="text" size="small">查看</el-button>
        <el-button type="text" size="small">编辑</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
  export default {
    methods: {
      handleClick() {
        console.log(1);
      },
      getUserList(){
        axios.get('/api/list')
        .then(response => {
          this.tableData = response.data
          this.laoding = false
          console.log(response.data);
        });
      }
    },
    data () {
      return {
        tableData: [],
        laoding:true,
      }
    },
    created() {
      this.getUserList();
    }
  }
</script>